﻿<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    
    <script src="http://ditu.google.cn/maps?file=api&amp;v=2.x&amp;key=ABQIAAAAQjeWVo6uMCt1ZTLqH9qYVhRtNoRRJC4nGUYHwUlZOhcKpFcC5hTEtpuOTMSWD8qT7EMvf87Fc1m0ag"
        type="text/javascript"></script>

    <script type="text/javascript">

    window.onload = function() { _GM_Initialize("Position_Canvas", false, 18); }

//    window.onunload = GUnload;

    var _GM_Map = null;
    var _GM_Geocoder = null;

    function _GM_Initialize(strCanvasId, blIsZoom, numSize) {

        var strAddress = document.getElementById("Position_Address").value;

        if (GBrowserIsCompatible()) {
            _GM_Map = new GMap2(document.getElementById(strCanvasId));
            _GM_Map.addControl(new GSmallMapControl()); //放大缩小控件

            if (blIsZoom == false) {
                _GM_Map.addControl(new _GM_Zoom()); //自定义控件
            }
            else if (blIsZoom == true) {
                _GM_Map.addControl(new _GM_Close()); //自定义控件
            }
            
            _GM_Geocoder = new GClientGeocoder();
        }
        _GM_ShowAddress(strAddress, numSize);
    }

    function _GM_ShowAddress(address, numSize) {
    
        if (_GM_Geocoder) {        
            _GM_Geocoder.getLatLng
            (
                address,
                function(point) {                
                    if (!point){ _GM_ShowAlert("不能解析: " + address); } 
                    else {
                        _GM_Map.setCenter(point, numSize);
                        var marker = new GMarker(point);
                        _GM_Map.addOverlay(marker);
                    }
                }
            );
        }
    }

    function _GM_ShowAlert(strMessageId) {
    
        var oMapCanvas = document.getElementById("Position_Canvas");
        
        if(!oMapCanvas){ return; }
        
        oMapCanvas.innerHTML = strMessageId;
        oMapCanvas.style.textAlign = "center";
        oMapCanvas.style.verticalAlign = "middle";
        oMapCanvas.style.lineHeight = oMapCanvas.style.height;
     }
    
    // _GM_Zoom 自定义控件，查看大图
    // （取代Google 地图上对应的图标按钮）
    function _GM_Zoom() {}
    
    _GM_Zoom.prototype = new GControl();

    // 为每个按钮创建一个 DIV，并将其放在容器 DIV 中，
    // 然后返回容器 DIV 作为我们的控件元素。将该控件添加到
    // 地图容器中，并将其返回，以便地图类能正确地放置它。
    _GM_Zoom.prototype.initialize = function(_GM_Map) 
    {   
        var container = document.createElement("div");

        //NeedZoom
        this._GM_Zoom_Format(container);
        container.onclick = _GM_Zoom_Go;
        container.onmouseover = function(){ this.style.backgroundPosition = "31px 0px"; }
        container.onmouseout = function(){ this.style.backgroundPosition = "0px 31px"; }
        container.onmousedown = function(){ this.style.border = "inset 2px"; }
        container.onmouseup = function(){ this.style.border = "outset 2px"; }
        
        _GM_Map.getContainer().appendChild(container);
        
        return container;
    }

    // 默认情况下，该控件将在地图的右上角显示，边距为 7 像素。
    _GM_Zoom.prototype.getDefaultPosition = function() 
    {
        return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(7, 7));
    }    
    
    function _GM_Zoom_Go() {

        var oDetail = document.getElementById("Position_Detail");
        
        oDetail.style.display = "block";

        _GM_Initialize("Position_Detail", true, 18);
    }
    
    // 设置给定按钮元素的正确 CSS。
    _GM_Zoom.prototype._GM_Zoom_Format = function(button) 
    {
        button.style.backgroundColor = "#F4F1E4";
        button.style.backgroundImage = "url(../../Content/img/public/_GM_Zoom.gif)";
        button.style.display = "block";
        button.style.width = "31px";
        button.style.height = "31px";
        button.style.border = "outset 2px";
        button.style.cursor = "pointer";
    }

    // _GM_Close 自定义控件，关闭大图
    // （取代Google 地图上对应的图标按钮）
    function _GM_Close() { }

    _GM_Close.prototype = new GControl();

    // 为每个按钮创建一个 DIV，并将其放在容器 DIV 中，
    // 然后返回容器 DIV 作为我们的控件元素。将该控件添加到
    // 地图容器中，并将其返回，以便地图类能正确地放置它。
    _GM_Close.prototype.initialize = function(_GM_Map) {
        var container = document.createElement("div");

        //NeedZoom
        this._GM_Close_Format(container);
        container.onclick = _GM_Close_Go;
        container.onmouseover = function() { this.style.backgroundPosition = "31px 0px"; }
        container.onmouseout = function() { this.style.backgroundPosition = "0px 31px"; }
        container.onmousedown = function() { this.style.border = "inset 2px"; }
        container.onmouseup = function() { this.style.border = "outset 2px"; }

        _GM_Map.getContainer().appendChild(container);

        return container;
    }

    // 默认情况下，该控件将在地图的右上角显示，边距为 7 像素。
    _GM_Close.prototype.getDefaultPosition = function() {
        return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(7, 7));
    }

    function _GM_Close_Go() {

        var oDetail = document.getElementById("Position_Detail");

        oDetail.style.display = "none";
    }

    // 设置给定按钮元素的正确 CSS。
    _GM_Close.prototype._GM_Close_Format = function(button) {
        button.style.backgroundColor = "#F4F1E4";
        button.style.backgroundImage = "url(../../Content/img/public/_GM_Close.gif)";
        button.style.display = "block";
        button.style.width = "31px";
        button.style.height = "31px";
        button.style.border = "outset 2px";
        button.style.cursor = "pointer";
    }
    
    </script>
    
    <style type="text/css">
        
        #Position_Detail
        {
        	position:absolute; 
        	left:100px; 
        	top:100px;
        	width:800px;
        	height:600px;
        	background-color:White;
        	border:solid 1px black;
        	z-index:99;
        	display:none
        }
        
        #Position_Canvas
        {
        	width: 285px; 
        	height: 200px;
        }        
        
    </style>

    <img src="../../Content/img/public/map_toppic.jpg" style=" width:285px; margin-bottom:-2px"/>
    
    <%=Html.Hidden("Position_Address",Model.ToString())%>
    
    <div id="Position_Detail"></div>
    
    <div id="Position_Canvas"></div>